<template>
  <div class="app-container">
    <el-tabs v-model="activeTab" @tab-change="handleTabChange">
      <el-tab-pane label="个人参赛人员" name="individual">
        <individualregistration :competition-name="competitionName" :competition-id="competitionId"></individualregistration>
      </el-tab-pane>
      <el-tab-pane label="团队参赛队伍" name="team">
        <teamregistration :competition-name="competitionName" :competition-id="competitionId"></teamregistration>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script setup>
import { ref } from 'vue'
import { useRoute } from 'vue-router'
import individualregistration from '@/views/competitionmanagement/individualregistration/index.vue'
import teamregistration from '@/views/competitionmanagement/teamregistration/index.vue'

const route = useRoute()
const activeTab = ref('individual')

// 获取路由参数
const competitionId = route.query.competitionId
const competitionName = route.query.competitionName

function handleTabChange(tabName) {
  activeTab.value = tabName;
}
</script>
<style scoped>
</style>